<template>
    <view>
		<xmInfo
		  :projectno="dataInfo.projectno"
		  :projectname="dataInfo.projectname"
		  ref="xmInfo"
		></xmInfo>
        <form >
            
          <!--  <view class="cu-form-group margin-top">
                <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>工程编号</view>
                <view>{{dataInfo.projectno}}</view>
            </view>
            <view class="cu-form-group ">
                <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>工程名称</view>
                <view>{{dataInfo.projectname}}</view>
            </view> -->
			
			<view class="cu-form-group " style="margin-top: 10px;">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>停水时间</view>
			    <view><u-input placeholder="请选择停水时间" v-model="dataInfo.connectwatertime" type="select" class="input-align" :select-open="startTime"
							@click="startTime = true"></u-input></view>
			</view>
		
			<view class="cu-form-group ">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>施工时间(小时)</view>
			    <view>
					<u-input placeholder="请输入施工时间" v-model="dataInfo.constructiontime" type="digit" maxlength="200" class="input-align"></u-input>
				</view>
			</view>
			<view class="cu-form-group ">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>接水类别</view>
			    <view>
					<js-select v-model="dataInfo.name" dict-type="zf_conWater_type" placeholder="请选择接水类别" class="input-align"></js-select>
				</view>
			</view>
			<view class="cu-form-group ">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>接水管道口径</view>
			    <view>
					<js-select v-model="dataInfo.pipesize" dict-type="zf_pipe_size" placeholder="请选择接水管道口径" class="input-align"></js-select>
				</view>
			</view>
			<view class="cu-form-group ">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>管道直径</view>
			    <view>
					<u-input placeholder="请输入管道直径" v-model="dataInfo.diameter" type="digit" maxlength="200" class="input-align"></u-input>
				</view>
			</view>
			<view class="cu-form-group ">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>行政区域</view>
			    <view>
					<js-select v-model="dataInfo.administrativearea" mode='multiple' dict-type="zf_Area" placeholder="请选择行政区域" class="input-align"></js-select>
				</view>
			</view>
			<view class="cu-form-group ">
			    <view class="title"><text class="cuIcon-favorfill text-xs text-red"></text>信息收集表上传</view>
			    <view>
					<js-uploadfile v-model="dataInfo.dataMap" :biz-key="dataInfo.id" biz-type="ConnectWaterJobCreate_image"></js-uploadfile>
				</view>
			</view>
			
			<u-picker mode="time" :params="params" v-model="startTime" @confirm="startConfirm"></u-picker>
			
         <!-- <view style="height: 80px" ></view>
            <view class="btn-group cu-bar foot ">
                <button class="cu-btn bg-blue shadow-blur">提交</button>
                <button class="cu-btn text-green line-blue shadow">完善信息</button>
            </view> -->
        </form>
		<view style="height: 80px"></view>
		<view class="btn-group cu-bar foot">
		  <!-- <button class="cu-btn bg-green shadow-blur">提交</button> -->
		  <view class="flex">
		      <js-bpm-button
				v-model="dataInfo.bpm"
				:biz-key="dataInfo.id"
				form-key="Flow_ConnectWaterJob"
				@complete="submit"
			  ></js-bpm-button>
		  </view>
		</view>
        <!-- <add-detail :modalNameDetail="modalNameDetail" @modalNameDetailEmit="modalNameDetailEmit" v-if="showAddDetail"></add-detail> -->
        
    </view>
</template>
<script>
import xmInfo from "@/pages/zfgs/index/componetns/xmInfo.vue";
export default {
	components: { xmInfo},
    data(){
        return{
			params:{
				year: true,
				month: true,
				day: true,
				hour: true,
				minute: true,
				// second: true
			},
			startTime: false, //控制日期显示
            uploadOptions:{},
            switchA: false,
            date: '2024-03-12',
            index:-1,
            modalName: null,
            imgList:["http://192.168.1.49:8080/app/static/image/zfgs/zfgs1.jpg","http://192.168.1.49:8080/app/static/image/zfgs/zfgs2.jpg"],
            imageUrl: ["http://192.168.1.49:8080/app/static/image/zfgs/zfgs1.jpg","http://192.168.1.49:8080/app/static/image/zfgs/zfgs2.jpg"],
            modalNameDetail: null,
            showAddDetail:false,
            dataInfo:{
            },
            picker: ['临时计划','年度计划'],
            pickerArea: ['江北区','渝北区','两江新区'],
            showButton : true
        }
    },
    onLoad(e){
        // this.dataInfo = JSON.parse(e.item)
		if(e.id){
			this.$u.api.zfgs.pmConnectwaterjobForm(e).then(res => {
				this.dataInfo = res.pmConnectwaterjob
			})
		}else{
			this.dataInfo = e
		}
		// this.$u.api.zfgs.pmConnectwaterjobForm(e).then(res => {
		// 	this.dataInfo = res.pmConnectwaterjob
		// })
		
    },
    methods:{
		startConfirm(e) {
			// + ":" + e.second
			this.dataInfo.connectwatertime = e.year + "-" + e.month + "-" + e.day + " " + e.hour+ ":" + e.minute
		},
        SwitchA(e) {
            // this.switchA = e.detail.value
        },
        DateChange(e) {
            this.date = e.detail.value
        },
        textareaAInput(e){
            this.dataInfo.dmark = e.detail.value
        },
        addDetail(){

            this.showAddDetail = true
            
            this.modalNameDetail = 'bottomModal'

            console.log(this.modalNameDetail)
        },
        modalNameDetailEmit(e){
            this.modalNameDetail = e
        },

        ViewImage(imageList,e) {
            uni.previewImage({
                urls: imageList,
                current: e.currentTarget.dataset.url
            });
        },
        DelImg(e) {
            uni.showModal({
                title: '',
                content: '确定要删除吗？',
                cancelText: '取消',
                confirmText: '确认',
                success: res => {
                    if (res.confirm) {
                        console.log(res.confirm,this.dataInfo.dImageList ,e,this.dataInfo.dImageList[e.currentTarget.dataset.index]);
                        // this.dataInfo.dImageListst.splice(e.currentTarget.dataset.index, 1)
                        // if (this.dataInfo.dImageListst) {
                        //     console.log(e.currentTarget.dataset.index,this.dataInfo.dImageListst,'e====')
                        //     this.dataInfo.dImageListst.splice(e.currentTarget.dataset.index, 1);
                        // }
                        // this.$set(this.dataInfo.dImageListst, e.currentTarget.dataset.index,1)
                        // this.dataInfo.dImageListst.splice(e.currentTarget.dataset.index, 1);
                        this.$delete(this.dataInfo.dImageListst, e.currentTarget.dataset.index);
                        
                        
                    }
                }
            })
        },
        ChooseImage() {
            uni.chooseImage({
                count: 4, //默认9
                sizeType: ["original", "compressed"], //可以指定是原图还是压缩图，默认二者都有
                sourceType: ["album"], //从相册选择
                success: (res) => {
                    if (this.dataInfo.shiYaFile.length != 0) {
                        this.dataInfo.shiYaFile = this.dataInfo.shiYaFile.concat(res.tempFilePaths);
                    } else {
                        this.dataInfo.shiYaFile = res.tempFilePaths;
                    }
                    
                    console.log(this.dataInfo,'this.dataInfo')
                    this.$u.toast("上传成功");
                }
            });
        },
        PickerChange(e){
            this.dataInfo.jieshui_type = e.detail.value
        },
        RadioChange(e){
            this.dataInfo.jieshui_guandao = e.detail.value
        },
        PickerChangeArea(e){
            
            this.dataInfo.jieshui_area = e.detail.value
        },
        imgListChange(e){

        },
		submit() {
		  
		  if(!this.dataInfo.projectno){
		    this.$u.toast("请输入工程名称");
		    return;
		  }
		  if(!this.dataInfo.projectname){
		    this.$u.toast("请输入工程编码");
		    return;
		  }
		  if(!this.dataInfo.connectwatertime){
		    this.$u.toast("请选择停水时间");
		    return;
		  }
		  if(!this.dataInfo.constructiontime){
		    this.$u.toast("请输入施工时间");
		    return;
		  }
		  if(!this.dataInfo.name){
		    this.$u.toast("请选择接水类别");
		    return;
		  }
		  if(this.dataInfo.pipesize == '' || this.dataInfo.pipesize == null ){
		    this.$u.toast("请输入接水管道口径");
		    return;
		  }
		  if(!this.dataInfo.diameter){
		    this.$u.toast("请选择管道直径");
		    return;
		  }
		  if(!this.dataInfo.administrativearea){
		    this.$u.toast("请选择行政区域");
		    return;
		  }
		  if(!this.dataInfo.dataMap || !this.dataInfo.dataMap.ConnectWaterJobCreate_image){
		    this.$u.toast("信息收集表必传");
		    return;
		  }
			this.dataInfo.status = 4;
			this.dataInfo.connectwatertime = this.dataInfo.connectwatertime + ':00'
		    try {
		      this.$u.api.zfgs
		        .pmConnectwaterjobSave(this.dataInfo)
		        .then((res) => {
		          if (res.result == "true") {
		            this.$u.toast(res.message);
					setTimeout(() => {
					  uni.navigateBack({
					    delta: 1,
					  });
					}, 500);
		          }else{
					 uni.showModal({
					 	title: '提示',
					 	content: res.message,
					 	showCancel: false,
					 	success: function(res) {}
					 });
		          }
		        });
		    } catch (error) {
		      this.$u.toast(error.message);
		    } finally {
		      // this.isSubmitting = false;
		    }
		},

    }
}
</script>
<style lang="scss" scoped>
/deep/.u-input__input.data-v-460c1d26 {
  text-align: right !important;
}
.action {
  color: #303133;
}
.title {
  flex-shrink: 0;
}
.text-sl {
  font-size: 22px !important;
}
.cu-bar {
  min-height: 80px;
}
.cu-btn {
  font-size: 16px;
  height: 40px;
}
.foot {
  z-index: 997;
  background: #fff;
}
.green {
  color: green;
}
.input-align {
  text-align: right;
}
::v-deep .u-input__input {
  text-align: right;
}
.text-xs {
  font-size: 18rpx !important;
}
</style>